var ApprovalSearchForm = function () {
  var template = /*html*/ `
    <div class="search-form">
      <el-form :model="search" :inline="true">
        <el-form-item :label="timeType[mode]">
          <el-date-picker v-model="search.startDate" class="form-input" value-format="timestamp" :editable="false"
            :picker-options="startDateOption"></el-date-picker>
          -
          <el-date-picker v-model="search.endDate" class="form-input" value-format="timestamp" :editable="false"
            :picker-options="endDateOption"></el-date-picker>
        </el-form-item>
        <el-form-item label="审批状态">
          <el-select clearable v-model="search.status" class="form-input">
            <el-option v-for="(label,value) in statusList" :key="'stats_'+value" :value="value" :label="label">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="部门/人员">
          <dept-person-select v-model="search.deptPerson" class="form-input" :options="personList"></dept-person-select>
        </el-form-item>
      </el-form>
    </div>
  `;
  return {
    mixins:[datePickerOptionsMixin('startDate','endDate')],

    props: {
      search: {
        type: Object,
        required: true
      },

      personList: {
        type: Array,
        default: function () {
          return [];
        }
      },

      mode: {
        type: String,
        default: 'takeoff'
      }
    },

    data: function () {
      return {
        timeType: {
          "takeoff": "请假时间",
          "supplementCard": "补卡时间",
          "overtime": "加班时间",
          "reimbursement": "报销时间",
          "punishmenty": "申请时间",
          "reward": "申请时间"
        },
        statusList: {
          "0": "审批中",
          "1": "审批通过",
          "2": "审批拒绝",
          "3": "已撤销"
        }
      };
    },

    components: {
      DeptPersonSelect: DeptPersonSelect
    },

    template: template
  };
}();
